<template>
  <a-result
      status="success"
      title="Payment successful"
      sub-title="Your order is ready for shipment"
  >
    <template #extra>
      <a-button @click="toOrderInfo" key="console" type="primary">Go to the order page</a-button>
      <a-button @click="toMainPage">Return to home page</a-button>
    </template>
  </a-result>
</template>

<script lang="ts">
import {defineComponent, ref, reactive, computed, watch, onMounted} from 'vue'
import {useStore} from 'vuex'
import {useRouter, useRoute} from 'vue-router'

export default defineComponent({
  setup(props, context) {
    const store = useStore();
    const router = useRouter();
    const route = useRoute();

    const toOrderInfo=()=>{
      if(route.query!=null&&route.query.id!=null){
        router.push({
          path:'/user/order/'+route.query.id
        })
      }else {
        router.push({
          path:'/'
        })
      }
    }

    const toMainPage=()=>{
      router.push({
        path:'/'
      })
    }

    return {
      toOrderInfo,
      toMainPage
    }
  }
})
</script>

<style scoped>
</style>
